<template>
  <div class="queryIndex ">
    <div class="container">
      <div class="logo">
        <a class="title">
          全面风险管理系统
        </a>
        <p class="systemHeadline">
          <img src="../../static/images/queryHeadline.png" alt="">
        </p>
        <p class="breadClumn">
          <span>当前位置：</span>
          <router-link :to="{path:'/pageIndex'}">
            首页 >
          </router-link>
          <span>综合查询</span>
        </p>
      </div>
    </div>
    <div class="colum-list">
      <div class="catalogList2 ">
        <div class="colum-list-ul">
          <div class="container">
            <ul  >
              <li class="li-1">
                <div class="li-div1">
                    <div>
                      <router-link :to="{path:'/commentForm'}">
                        <span>评价点查询</span>
                      </router-link>
                    </div>
                </div>
                <div class="li-div1">
                  <div>
                    <router-link :to="{path:'/commentTalk'}">
                      <span>评价底稿查询</span>
                    </router-link>
                  </div>
                </div>
              </li>
              <li class="li-2">
                <div class="li-div2">
                  <div>
                    <router-link :to="{path:'/companyProgress'}">
                      <span>评价点工作进度查询</span>
                    </router-link>
                  </div>
                </div>
                <div class="li-div2">
                  <div>
                    <router-link :to="{path:'/lcProgress'}">
                      <span>流程评价工作进度查询</span>
                    </router-link>

                  </div>
                </div>
                <div class="li-div2">
                  <div>
                    <router-link :to="{path:'/qiyeProgress'}">
                      <span>企业评价工作进度查询</span>
                    </router-link>
                  </div>
                </div>
              </li>
              <li class="li-3">
                <div class="li-div3">
                  <div>
                    <router-link :to="{path:'/defectForm'}">
                      <span>缺陷整改查询</span>
                    </router-link>
                  </div>
                </div>
                <div class="li-div3">
                  <div>
                    <router-link :to="{path:'/defectTotal'}">
                      <span>缺陷统计查询</span>
                    </router-link>
                  </div>
                </div>
              </li>
              <!--<li>-->
                <!--<router-link :to="{path:'/commentForm'}">-->
                  <!--<div>-->
                    <!--<span>评价点查询</span>-->
                  <!--</div>-->
                <!--</router-link>-->
              <!--</li>-->
              <!--<li>-->
                <!--<router-link :to="{path:'/defectForm'}">-->
                  <!--<div>-->
                    <!--<span>缺陷整改表</span>-->
                  <!--</div>-->
                <!--</router-link>-->
              <!--</li>-->
              <!--<li class="yellowLine">-->
                <!--<router-link :to="{path:'/defectTotal'}">-->
                  <!--<div >-->
                    <!--<span>缺陷统计表</span>-->
                  <!--</div>-->
                <!--</router-link>-->
              <!--</li>-->
              <!--<li>-->
                <!--<router-link :to="{path:'/companyProgress'}">-->
                  <!--<div>-->
                    <!--<span>公司评价工作进度表</span>-->
                  <!--</div>-->
                <!--</router-link>-->
              <!--</li>-->
              <!--<li>-->
                <!--<router-link :to="{path:'/qiyeProgress'}">-->
                  <!--<div>-->
                    <!--<span>企业评价工作进度表</span>-->
                  <!--</div>-->
                <!--</router-link>-->
              <!--</li>-->
            <!--</ul>-->
            <!--<ul  >-->
              <!--<li>-->
                <!--<router-link :to="{path:'/lcProgress'}">-->
                  <!--<div>-->
                    <!--<span>流程评价工作进度表</span>-->
                  <!--</div>-->
                <!--</router-link>-->
              <!--</li>-->
              <!--<li>-->
                <!--<router-link :to="{path:'/sampling'}">-->
                  <!--<div>-->
                    <!--<span>抽样表单底稿</span>-->
                  <!--</div>-->
                <!--</router-link>-->
              <!--</li>-->
              <!--<li class="yellowLine">-->
                <!--<router-link :to="{path:'/sceneInspect'}">-->
                  <!--<div >-->
                    <!--<span>现场检查底稿</span>-->
                  <!--</div>-->
                <!--</router-link>-->
              <!--</li>-->
              <!--<li>-->
                <!--<router-link :to="{path:'/commentTalk'}">-->
                  <!--<div>-->
                    <!--<span>评价访谈底稿</span>-->
                  <!--</div>-->
                <!--</router-link>-->
              <!--</li>-->
              <!--<li>-->
                <!--<router-link :to="{path:'/cxcs'}">-->
                  <!--<div>-->
                    <!--<span>穿行测试底稿</span>-->
                  <!--</div>-->
                <!--</router-link>-->
              <!--</li>-->
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>

</script>

<style scoped="">
  body,html{
    width: 100%;
    height: 100%;
  }
  #app{
    height: 100% !important;
    width: 100%;
  }
  .queryIndex {
    width: 100%;
    height: 100%;
    background: #e9ece5;
    overflow: hidden;
    background-image: url("../../static/images/otherBanner.jpg");
    background-repeat: no-repeat;
    background-position: center;
  }
  .pageIndex .logo{
    margin-top:80px;
  }
  .queryIndex .colum-list{
  }
  .queryIndex  .colum-list ul{
    padding-top: 20px;
  }
  .queryIndex .colum-list .catalog{
    width: 310px;
    height: 373px;
    background: #ffffff;
    position: relative;
    padding-top: 7px;
    border-top-right-radius: 12px;
  }
  .queryIndex .colum-list .catalog:before{
    position: absolute;
    content: '';
    left: 0;
    top:0;
    width: 100%;
    height:7px;
    background-image: url("../../static/images/category1Line.png");
    background-repeat: no-repeat;

  }
  .queryIndex  .colum-list .catalog  div{
    position: absolute;
    left: 0;
    top:0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 150px;
    height: 150px;
    font-size: 26px;
    color: #666666;
    text-align: center;
  }
  .queryIndex  .colum-list .catalog  div img{
    margin-bottom: 20px;
  }
  .queryIndex .catalogList2{
    position: relative;
  }
  .queryIndex  .breadClumn{
    padding-top: 40px;
    padding-bottom: 20px;
    color: #508018;
  }
  .queryIndex   .breadClumn a{
    color:#508018;
    font-size: 16px;
  }
  .queryIndex  .catalogList2 ul{
    font-size: 0;
  }
  .queryIndex .catalogList2 li.li-1{
    display: inline-block;
    width: 350px;
    position: relative;
    border-top-right-radius: 12px;
    margin-right: 20px;
    vertical-align: top;
    overflow: hidden;
  }
  .queryIndex .catalogList2 li.li-2{
    display: inline-block;
    width: 470px;
    position: relative;
    margin-right: 10px;
    vertical-align: top;
    overflow: hidden;
  }
  .queryIndex .catalogList2 li.li-3{
    display: inline-block;
    width: 350px;
    position: relative;
    margin-right: 0px;
    vertical-align: top;
    overflow: hidden;
  }
  .queryIndex .catalogList2 li .li-div1:before{
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 100%;
    height: 7px;
    background: #8cc34b;
    background-position: center;
    background-repeat: no-repeat;
    background: linear-gradient(-135deg, transparent 4px, #8cc34b 0) top right;
  }
  .queryIndex .catalogList2 li .li-div2:before{
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 100%;
    height: 7px;
    background: #8cc34b;
    background-position: center;
    background-repeat: no-repeat;
    background: linear-gradient(-135deg, transparent 4px, #8cc34b 0) top right;
  }
  .queryIndex .catalogList2 li .li-div3:before{
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 100%;
    height: 7px;
    background: #8cc34b;
    background-position: center;
    background-repeat: no-repeat;
    background: linear-gradient(-135deg, transparent 4px, #8cc34b 0) top right;
  }
  .queryIndex .catalogList2 .li-1 .li-div1 div,
  .queryIndex .catalogList2 .li-2 .li-div2 div,
  .queryIndex .catalogList2 .li-3 .li-div3 div{
    font-size: 22px;
    color: #666666;
    text-align: center;
    vertical-align: middle;
    width: 100%;
    margin:  0 auto;
    background: white;
    /*margin-top: 45px;*/
  }
  .queryIndex .catalogList2 .li-1 .li-div1{
    height: 187px;
    margin-bottom: 16px;
    line-height: 180px;
    padding-top: 7px;
    position: relative;
  }
  .queryIndex .catalogList2 .li-1 .li-div1{
    height: 180px;
    line-height: 180px;
  }
  .queryIndex .catalogList2 .li-1 .li-div1:nth-child(2){
  }
  .queryIndex .catalogList2 .li-2 .li-div2{
    height: 112px;
    margin-bottom:15px ;
    line-height:112px;
    padding-top: 7px;
    position: relative;
  }
  .queryIndex .catalogList2 .li-3 .li-div3{
    height: 180px;
    margin-bottom: 16px;
    line-height: 180px;
    padding-top: 7px;
    position: relative;
  }

  .queryIndex  .catalogList2 li div span{
    vertical-align: middle;
  }
  .queryIndex  .catalogList2 li div  a span{
    color: #333;
  }
  .queryIndex  .catalogList2 li div img{
    vertical-align: middle;
  }
  .queryIndex .systemHeadline{
    text-align: center;
    padding-top: 47px;
  }
  .queryIndex  .logo .title{
    display: inline-block;
    font-size: 22px;
    font-weight: bold;
    color:#444444 ;
    padding-top:20px ;
  }
  .queryIndex .colum-list-ul{
    height: 454px;
    background: rgba(196,220,168,0.4);
  }
  @media screen and (max-width: 1400px){
    .queryIndex .systemHeadline{
      text-align: center;
      padding-top: 20px;
    }
    .queryIndex  .breadClumn{
      padding-top: 30px;
      padding-bottom: 10px;
      color: #508018;
    }

  }
</style>
